import React, { useState, useRef } from 'react';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import ProTable from '@ant-design/pro-table';
import { queryUserLecturesDetailed } from './service';
import { connect } from 'dva';
import {formatPrice} from '@/utils/utils';
const CourseReport = props => {
  const {location} = props ||{};
  const {query} = location ||{};
  const {userId} = query;
  const [columns, setColumns] = useState([
    {
      title: '员工名称',
      dataIndex: 'userName',
    },
    {
      title: '课程名称',
      dataIndex: 'courseName',
    },
    {
      title: '课程类型',
      dataIndex: 'courseType',
      hideInSearch:true,
      valueEnum: {
        1: {
          text: '大班课',
          status: 'Success',
        },
        2: {
          text: '小班课',
          status: 'Success',
        },
        3: {
          text: '私教课',
          status: 'Warning',
        },
      },
    },
    {
      title: '价格',
      dataIndex: 'courseMoney',
      hideInSearch:true,
      render:(text)=>`${formatPrice(text??0)}元`
    },
    {
      title: '渗透率',
      dataIndex: 'utilization',
    },
  ]);
  const actionRef = useRef();

  return (
    <PageHeaderWrapper>
      <ProTable
        actionRef={actionRef}
        rowKey={record => record.courseName}
        request={params => {
          return queryUserLecturesDetailed({
            ...params,
            userId
          })
        }}
        columns={columns}
      />
    </PageHeaderWrapper>
  );
};

export default connect(({ loading,cubeCourseReport }) => ({
  shopList: cubeCourseReport.shopList
}))(CourseReport);